{extend name='layout/base'}
{block name='title'}{__block__}个人资料{/block}
{block name='head'}
<!-- 加载省市联动插件 -->
<link rel="stylesheet" type="text/css" href="__PUBLIC__/static/jq_city/css/city-picker.css"/>
<script type="text/javascript" src="__PUBLIC__/static/jq_city/js/city-picker.data.js"></script>
<script type="text/javascript" src="__PUBLIC__/static/jq_city/js/city-picker.js"></script>
<script type="text/javascript" src="__PUBLIC__/static/jq_city/js/main.js"></script>
<!-- 加载日历插件 -->
<link rel="stylesheet" type="text/css" href="__PUBLIC__/static/datepicker/css/foundation.css"/>
<link rel="stylesheet" type="text/css" href="__PUBLIC__/static/datepicker/css/foundation-datepicker.css"/>
<link rel="stylesheet" type="text/css" href="http://www.jq22.com/jquery/font-awesome.4.6.0.css"/>
<script type="text/javascript" src="__PUBLIC__/static/datepicker/js/foundation-datepicker.js"></script>
<script type="text/javascript" src="__PUBLIC__/static/datepicker/js/locales/foundation-datepicker.zh-CN.js"></script>
{/block}
{block name='content'}

<div class="row left">
    <div class="col-md-2"></div>
    <div class="col-md-8">
        <div class="col-md-4">
            {include file='layout/menu'}             
        </div>      
        <div class="col-md-8">

            <div class="page-header">
                <h1>个人资料</h1>
            </div>
            <form class="form-horizontal" action="<?php echo url('index/user.Info/save');?>" method="post">
                <div class="form-group">
                    <label for="inputEmail3" class="col-sm-2 control-label">用户昵称</label>
                    <div class="col-sm-10">
                        <input type="text" name="r_user" class="form-control" id="r_user" placeholder="{$userdata['nickname']}">
                        <span id="r_user_prompt"></span>
                    </div>
                </div>
                <div class="form-group">
                    <label for="inputEmail3" class="col-sm-2 control-label">邮箱</label>
                    <div class="col-sm-10">
                        <input type="email" name="r_email" class="form-control" id="r_email" placeholder="{$userdata['email']}">
                        <span id="r_email_prompt"></span>                                       
                    </div>
                </div>    

                <div class="form-group">
                    <label for="inputEmail3" class="col-sm-2 control-label">姓名</label>
                    <div class="col-sm-10">
                        <input type="text" name="r_name" class="form-control" id="r_name" placeholder="{$userdata['name']}">
                    </div>
                </div>  

                <div class="form-group">
                    <label for="inputEmail3" class="col-sm-2 control-label">性别</label>
                    <div class="col-sm-10">
                        <?php
                            //读取extra/set.php中的配置
                            $config_status = config('set.sex_status');
                            foreach($config_status as $key => $value):
                                //$key的值有可能是0、1 
                                $checked = (string)$key === (string)$userdata['sex'] ? 'checked' : '';
                        ?>
                        <label class="radio-inline">
                            <input type="radio" name="sex" id="men" value="{$key}" {$checked}> {$value}
                        </label>
                        <?php endforeach?>
                    </div>
                </div>      

                <div class="form-group">
                    <label for="inputEmail3" class="col-sm-2 control-label">电话号码</label>
                    <div class="col-sm-10">
                        <input type="tel" name="r_tel" class="form-control" id="r_tel" placeholder="{$userdata['phone']}">
                    </div>
                </div> 

                <div class="form-group">
                    <label for="inputEmail3" class="col-sm-2 control-label">所在地</label>
                    <div class="col-sm-10">
                        <!--省市联动start-->
                        <div class="docs-methods">
                            <div id="distpicker">
                                <div >
                                    <div style="position: relative;">
                                        <input id="city-picker3" class="form-control" readonly type="text" value="" placeholder="{$userdata['city']}" data-toggle="city-picker" name="provinces">
                                    </div>
                                </div>
                            </div>
                        </div>  
                        <!--省市联动end-->    
                    </div>
                </div> 

                <div class="form-group">
                    <label for="inputEmail3" class="col-sm-2 control-label">本人出生日期</label>
                    <div class="col-sm-6">
                        <!--日历小插件start-->
                        <input type="text"  value="" id="demo-2" class="form-control" name="birthday" placeholder="{$userdata['birthday']}">
                        <!--日历小插件end-->
                    </div>
                    <div class="col-sm-4"><span id="birthday_prompt"></span></div>
                </div> 

                <div class="form-group">
                    <label for="inputEmail3" class="col-sm-2 control-label">亲友生日</label>
                    <div class="col-sm-4">
                        <select class="form-control" name="relationship">
                            <?php
                                //读取extra/set.php中的配置
                                $config_status = config('set.relationship_status');                  
                                foreach($config_status as $key => $value):
                                    $selected = (string)$key === (string)$userdata['relationship'] ? 'selected' : '';
                            ?>
                            <option value="{$key}" {$selected}>{$value}</option>
                            <?php endforeach?>
                        </select>
                    </div>
                    <div class="col-sm-6">
                        <!--日历小插件start-->
                        <input type="text"  value="" id="demo-1" class="form-control" name="birtd" placeholder="{$userdata['birtd']}">
                        <!--日历小插件end-->
                    </div>
                </div>     
                <!--日历小插件js start-->
                <script>
                    $('#demo-1').fdatepicker({
                        format: 'yyyy-mm-dd',
                    });
                    $('#demo-2').fdatepicker({
                        format: 'yyyy-mm-dd hh:ii',
                        pickTime: true
                    });

                    var nowTemp = new Date();
                    var now = new Date(nowTemp.getFullYear(), nowTemp.getMonth(), nowTemp.getDate(), 0, 0, 0, 0);
                    var checkin = $('#dpd1').fdatepicker({
                        onRender: function (date) {
                            return date.valueOf() < now.valueOf() ? 'disabled' : '';
                        }
                    }).on('changeDate', function (ev) {
                        if (ev.date.valueOf() > checkout.date.valueOf()) {
                            var newDate = new Date(ev.date)
                            newDate.setDate(newDate.getDate() + 1);
                            checkout.update(newDate);
                        }
                        checkin.hide();
                        $('#dpd2')[0].focus();
                    }).data('datepicker');
                    var checkout = $('#dpd2').fdatepicker({
                        onRender: function (date) {
                            return date.valueOf() <= checkin.date.valueOf() ? 'disabled' : '';
                        }
                    }).on('changeDate', function (ev) {
                        checkout.hide();
                    }).data('datepicker');
                    //本人生日修改一次之后就不能再修改
                    $(document).ready(function(){
                        var ownbirthday = $('#demo-2').attr("placeholder");
                        $('#demo-2').click(function(){
                            $('#birthday_prompt').css('color','red').html('本人生日只能修改一次！');
                            if(ownbirthday.length > 1){
                                $(this).attr("disabled","true");
                            }
                        });
                        //当文档加载完之后自动点击一下demo-2框
                        $('#demo-2').click();
                        $('#birthday_prompt').html('');            
                    });

                </script>
                <!--日历小插件js end-->
                <div class="form-group">
                    <label for="inputEmail3" class="col-sm-2 control-label">您最爱的产品</label>
                    <div class="col-sm-10">
                        <select class="form-control" name="taste">
                            <?php
                                //读取extra/set.php中的配置
                                $config_status = config('set.taste_status');                  
                                foreach($config_status as $key => $value):
                                    $selected = (string)$key === (string)$userdata['favorite'] ? 'selected' : '';
                            ?>
                            <option value="{$key}" {$selected}>{$value}</option>
                            <?php endforeach?>
                        </select>
                    </div>
                </div> 
                     
                <div class="form-group">
                    <div class="col-sm-offset-2 col-sm-10">
                        <button type="submit" name="r_button" value="r_button" class="btn btn-primary">确认修改</button>
                    </div>
                </div>
            </form>
  
        </div>
    </div>
    <div class="col-md-2"></div>
</div>

{/block}
